<template>
  <div>
    <h2>B组件</h2>
    <p>B组件接收到A组件的参数：{{ receivedData }}</p>
  </div>
</template>

<script lang="ts" setup>
import { ref, onMounted, onBeforeUnmount } from "vue";
import { getCachedData, clearCachedData } from "@/utils/cacheBus";

const receivedData = ref<string>("");

onMounted(() => {
  // 先读取缓存数据（跳转前A组件存的）
  const cached = getCachedData();
  if (cached !== null) {
    receivedData.value = cached;
    console.log("B组件读取缓存数据：", cached);
  }
});

onBeforeUnmount(() => {
  clearCachedData(); // 清理缓存，避免内存泄漏
});
</script>
